<template>
    <div class="member-layout">

        <div>
                <div class="grid-content bor-radius-10 mg-bo-10 pos-relative"
                     v-bind:class="item.state == 1 ? 'selected' : 'closed'"
                >
                    <!-- <span class="decorate-circle"></span> -->
                    <!-- <input type="checkbox" class="check-box" :id="item.id" :value="item.name" v-model="checkedNames" > -->
                    <input :type="isMultiselect ? 'checkbox' : 'radio'"   name="radio" :id="'input-' + index" :value="item.name"
                           class="regular-input"/>

                    <label :for="'input-' + index"></label>



                    <div class="card-01">
                        <img src="../../../static/img/member.png">
                        <span class="member-name l1">{{item.name}}</span>
                        <div class="role">
                            <span :title="item.primaryOrganName" v-if="(item.primaryOrganName).length > 4">
                              {{item.userRoleNames.slice(0, 4) + "..."}}
                            </span>
                            <span v-else-if="(item.primaryOrganName).length == 0">
                              暂无
                            </span>
                            <span v-else>
                              {{item.primaryOrganName}}
                            </span>
                            <span class="line">|</span>
                            <span :title="item.userRoleNames" v-if="(item.userRoleNames).length > 4">
                              {{item.userRoleNames.slice(0, 4) + "..."}}
                            </span>
                            <span :title="item.userRoleNames" v-else-if="(item.userRoleNames).length == 0">
                              暂无
                            </span>
                            <span v-else>
                              {{item.userRoleNames}}
                            </span>
                        </div>
                    </div>
                    <router-link :to="{path:'/user/info', params:{userId:123}}">
                      <div class="btn-info">
                          <span >查看修改信息</span>
                      </div>
                    </router-link>


                    <!-- <span>Checked names: {{ checkedNames }}</span> -->

                </div>
        </div>
    </div>
</template>

<script>
    export default {
        props: {
            item: '',
            index: ''
        },
        data: function () {

            return {
                classItem: [],
                checkedNames: [],
                isMultiselect: false
            }
        },
        methods: {

        }

    }
</script>

<style scoped>
    .el-row {
        margin-bottom: 20px;

    &
    :last-child {
        margin-bottom: 0;
    }

    }


</style>
